import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { HttpRequest } from "../../../../service/httpRequest";
import { flyIn } from '../../../../animations/fly-in';
import { NotiService } from "../../../../service/noti.service";


declare var $:any;
@Component({
  selector: 'app-group-member',
  templateUrl: './group-member.component.html',
  styleUrls: ['./group-member.component.css'],
  animations: [
    flyIn
  ]
})
export class GroupMemberComponent implements OnInit {
  id:string = '';
  name:string = '';
  data:any = [];
  private gizwitsNotiWs:any;
  private eventType = ['device.status.kv'];
  paramsshow = '';
  pdata1:any;
  pdata2:any;
  pdata3:any;
  pdata4:any;
  constructor(private activeRoute:ActivatedRoute,
              private httpRequest:HttpRequest,
              private noti:NotiService) {
  }

  ngOnInit() {
    this.activeRoute.params.subscribe(
      params=> {
        this.id = params['groupId'];
        this.name = params['groupName'];
        //this.getData();
        this.getData();
      }
    );    
    //$('.imp').css({"width":$(document.body).width()*0.95,"height":$(document.body).height()-100});
    $('.showbox').css({"position":"absolute","margin-top":-$('.img img').height()*0.82,"margin-left":$('.groupimg').width()*0.37});
    $('.showbox1').css({"position":"absolute","margin-top":-$('.img img').height()*0.61,"margin-left":$('.groupimg').width()*0.37});
    $('.showbox2').css({"position":"absolute","margin-top":-$('.img img').height()*0.38,"margin-left":$('.groupimg').width()*0.37});
    $('.showbox3').css({"position":"absolute","margin-top":-$('.img img').height()*0.17,"margin-left":$('.groupimg').width()*0.37});
   

  }


  getData() {
    this.httpRequest.sendPost('device_property_of_group/properties', {group_id: this.id}).subscribe(res=> {
      //console.log(res);

      let tdata = res;
      this.data = res;
      //console.log(this.data)
      for(let i=0;i<res.length;i++){        
        if(res[i].device_id=="43f1e11ca1984febb59c384cbec671be/867967023402128"){
          this.pdata1 = res[i];
        }
        if(res[i].device_id=="43f1e11ca1984febb59c384cbec671be/867967023362132"){
          this.pdata2 = res[i];
        }
        if(res[i].device_id=="43f1e11ca1984febb59c384cbec671be/867967023402490"){
          this.pdata3 = res[i];
        }
        if(res[i].device_id=="43f1e11ca1984febb59c384cbec671be/867967023362199"){
          this.pdata4 = res[i];
        }     
      }
      
      //this.pdata1 = res[2];
      //this.pdata2 = res[0];
      //this.pdata3 = res[3];
      //this.pdata4 = res[1];
      let macs = [];
      let prokey;
      for (let i = 0; i < tdata.length; i++) {
        prokey = tdata[i].device_id.split('/')[0];
        let mac = tdata[i].device_id.split('/')[1];
        macs.push(mac);
      }
      if(prokey){
        this.gizwitsNotiWs = this.noti.init(prokey,macs,this.eventType,this.onEvent);
        this.gizwitsNotiWs.connect();
      }


      //this.getrealtime(prokey, macs);
    }, err=> {
    });
  }
  
  onEvent(msg) {
    //console.log(msg)  
    let tags = $('td[tag='+'"' + msg.product_key +'/'+msg.mac + '"]');    
    for (let i = 0; i < tags.length; i++) {
      let tag = tags[i];     
      let key = $(tag).attr('hu');
      $(tag).text(msg.data[key].toFixed(1));
      if(key=="Srun"&&msg.data[key]==1.0){   
        $(tag).text('运行');
      }
      if(key=="Srun"&&msg.data[key]==0.0){    
        $(tag).text('停止');
      }
      

    }

  }
     


 
}
